
/**
 * @desc 酒店设置，新增/修改弹框
 * @author yd_zhaorongjun
 */
<template>
  <div>
    <el-dialog
      :title="title"
      class="gl_dialog_TitleLine gl_dl_footer"
      :visible.sync="dialogVisible"
      :close-on-click-modal="false"
      width="632px"
    >
      <el-scrollbar v-loading="loading" wrap-class="scrollbar-wrapper gl_dialog_height">
        <el-form ref="Api_POST_TrainningSchedule" class="gl_form_mini" :model="Api_POST_TrainningSchedule" :rules="Api_POST_TrainningSchedule_Rules" label-position="top" label-width="120px" style="padding:0 30px">
          <el-row :gutter="20">
            <el-col :span="12">
              <!-- 开始时间 -->
              <el-form-item label="开始时间" prop="startTime">
                <el-date-picker
                  v-model="Api_POST_TrainningSchedule.startTime"
                  type="datetime"
                  placeholder="开始时间"
                  format="yyyy-MM-dd HH:mm"
                  value-format="yyyy-MM-dd HH:mm"
                  size="mini"
                  style="width:100%"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <!-- 结束时间 -->
              <el-form-item label="结束时间" prop="endTime">
                <el-date-picker
                  v-model="Api_POST_TrainningSchedule.endTime"
                  type="datetime"
                  placeholder="结束时间"
                  format="yyyy-MM-dd HH:mm"
                  value-format="yyyy-MM-dd HH:mm"
                  size="mini"
                  style="width:100%"
                />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="地点" prop="location">
                <el-input v-model="Api_POST_TrainningSchedule.location" placeholder="请输入" type="text" size="mini" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="事件" prop="title">
                <el-input v-model="Api_POST_TrainningSchedule.title" placeholder="请输入" type="text" size="mini" />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="20">
            <el-col :span="24">
              <!-- 描述 -->
              <el-form-item label="备注">
                <el-input
                  v-model="Api_POST_TrainningSchedule.comment"
                  type="textarea"
                  show-word-limit
                  :rows="3"
                  placeholder="请输入"
                />
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </el-scrollbar>

      <span slot="footer" class="dialog-footer">
        <!-- 取消按钮 -->
        <el-button size="mini" @click="dialogVisible = false">{{ $t('button.cancel') }}</el-button>
        <!-- 编辑的保存按钮 -->
        <el-button v-if="type == 'edit'" type="primary" :loading="submitLoading" size="mini" @click="saveEdit()">确 定</el-button>
        <!-- 新增的保存按钮 -->
        <el-button v-else type="primary" :loading="submitLoading" size="mini" @click="saveNew()">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { SiSTKWTrainCreateTrainningScheduleInput } from '@/lib/form/train/swaggerForm';
import validator from '@/lib/validate/index.js';
import { CopyData } from '@/lib';

export default {
  data() {
    return {
      Api_POST_TrainningSchedule: new SiSTKWTrainCreateTrainningScheduleInput(),
      Api_POST_TrainningSchedule_Rules: { // 必填项，验证密码格式
        startTime: [validator.required('时间不能为空', 'change')],
        endTime: [validator.required('时间不能为空', 'change')],
        location: [
          validator.required('地点不能为空')
        ],
        title: [
          validator.required('事件不能为空')
        ]
      },
      title: '',
      loading: false,
      submitLoading: false,
      dialogVisible: false,
      editionList: [],
      type: '', // 弹框状态，是新增和是修改 new 是新增，edit是修改
      rowId: '' // 编辑时候的id
    };
  },
  computed: {
  },
  watch: {
    dialogVisible(val) {
      if (!val) {
        this.$refs['Api_POST_TrainningSchedule'].resetFields();
      }
    }
  },
  methods: {
    open(row, type) {
      this.loading = true;
      this.type = type;
      this.rowId = row ? row.id : '';
      this.title = type === 'edit' ? '编辑日程信息' : '新增日程信息';
      this.Api_POST_TrainningSchedule = new SiSTKWTrainCreateTrainningScheduleInput();
      if (this.rowId) {
        CopyData(row, this.Api_POST_TrainningSchedule);
        this.Api_POST_TrainningSchedule.startTime = this.Api_POST_TrainningSchedule.startTime && this.Api_POST_TrainningSchedule.startTime.replace('T', ' ');
        this.Api_POST_TrainningSchedule.endTime = this.Api_POST_TrainningSchedule.endTime && this.Api_POST_TrainningSchedule.endTime.replace('T', ' ');
        console.log(this.Api_POST_TrainningSchedule);
      }
      this.$nextTick(() => {
        // this.initRules();
        this.dialogVisible = true;
        this.loading = false;
      });
    },
    // 初始化验证信息
    // initRules() {
    //   const _this = this;
    //   this.Api_POST_TrainningSchedule_Rules.startTime.push({
    //     validator(rule, value, callback) {
    //       // 开始日期不能小于结束日期
    //       if (new Date(_this.Api_POST_TrainningSchedule.startTime) > new Date(_this.Api_POST_TrainningSchedule.endTime)) {
    //         callback(new Error('开始日期不能小于结束日期'));
    //       }
    //       callback();
    //     },
    //     trigger: 'change'
    //   });
    //   this.Api_POST_TrainningSchedule_Rules.endTime.push({
    //     validator(rule, value, callback) {
    //       // 开始日期不能小于结束日期
    //       if (new Date(_this.Api_POST_TrainningSchedule.startTime) > new Date(_this.Api_POST_TrainningSchedule.endTime)) {
    //         callback(new Error('结束日期不能小于开始日期'));
    //       }
    //       callback();
    //     },
    //     trigger: 'change'
    //   });
    // },
    // 新增
    saveNew() {
      this.$refs.Api_POST_TrainningSchedule.validate(valid => {
        this.submitLoading = true;
        if (valid) {
          if (new Date(this.Api_POST_TrainningSchedule.startTime) > new Date(this.Api_POST_TrainningSchedule.endTime)) {
            this.$message({ type: 'warning', message: '开始日期不能小于结束日期' });
            this.submitLoading = false;
            return false;
          }
          this.$emit('insert', this.Api_POST_TrainningSchedule);
        } else {
          this.submitLoading = false;
          return false;
        }
      });
    },
    // 修改
    saveEdit() {
      this.$refs.Api_POST_TrainningSchedule.validate(valid => {
        this.submitLoading = true;
        if (valid) {
          if (new Date(this.Api_POST_TrainningSchedule.startTime) > new Date(this.Api_POST_TrainningSchedule.endTime)) {
            this.$message({ type: 'warning', message: '开始日期不能大于结束日期' });
            this.submitLoading = false;
            return false;
          }
          this.$emit('update', this.Api_POST_TrainningSchedule);
        } else {
          this.submitLoading = false;
          return false;
        }
      });
    }
  }
};
</script>
<style lang="scss" scoped>
  .tip_info_style {
    font-size: 14px;
    color: #C0C4CC;
  }
  .personalUserInfo_img_wrap .el-form-item__error {
    padding-left: 10px;
  }
  .upload_game_img.no_pointer {
    cursor: default;
  }
  .upload_game_img {
    width: 102px;
    height: 96px;
    line-height: 94px;
    text-align: center;
    font-size: 20px;
    border: 1px dotted #DCDFE6;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s ease;
    position: relative;
  }
  .upload_game_img .show_img {
    max-width: 100%;
    max-height: 100%;
    border-radius: 4px;
    vertical-align: middle;
  }
</style>
